<template>
	<view class="lones">
		<img class="imgs" src="https://img2.baidu.com/it/u=526964398,2952161189&fm=253&fmt=auto&app=138&f=JPEG" alt="">
	</view>
	<view class="ltows">
		<input type="text" placeholder-class="user-place" class="userinput" v-model="logins.username" placeholder="账号">
		<input type="password" placeholder-class="pass-place" class="passinput" v-model="logins.password" placeholder="密码">
	</view>
	<view class="lthress" @click="login">
		Login
	</view>
	<div class="lfoutrs">
		<p>Register Here</p>
		<p>Forgot Password ?</p>
	</div>
</template>

<script>
import request from '../../utils/request.js'
export default {
	data() {
		return {
			logins: {
				username: 'admin',
				password: '123456'
			}
		}
	},
	methods: {
		async login() {
			if (this.logins.username == '' || this.logins.password == '') { //非空判断
				uni.showModal({
					title: '不可为空',
					showCancel: false,
					content: "账号密码不可为空",
				})
			} else {
				let res = await request("/mzh/logins", this.logins, "POST") //请求
				if (res.data.code == 200) {
					uni.showToast({
						title: '登录成功',
						success(ress) {
							if (ress.errMsg) {
								setTimeout(function () {
									uni.setStorageSync('token', JSON.stringify(res.data.token))
									uni.switchTab({
										url: '/pages/optimization/optimization'
									})
								}, 1000);
							}
						}
					})
				}
				if (res.data.code == 201) {
					uni.showModal({
						title: res.data.msg,
						showCancel: false,
						content: "密码错误，请检查你的密码",

					})
				}
				if (res.data.code == 202) {
					uni.showModal({
						title: res.data.msg,
						showCancel: false,
						content: "账号不存在，请检查你的账号",
					})
				}
			}

		}
	}
}
</script>

<style>
page {
	height: 100%;
	background: url('https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fitem%2F201407%2F27%2F20140727130126_RJrJZ.thumb.1000_0.jpeg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1697872462&t=6ab9436c527ad0483f0918c374c20f68') no-repeat;
	background-size: 800rpx;
}

.lones {
	height: 300rpx;
	text-align: center;
	margin-top: 100rpx;
}

.lones .imgs {
	width: 200rpx;
	height: 200rpx;
	border-radius: 100rpx;
}

.ltows {
	height: 300rpx;
}

.ltows .userinput {

	height: 100rpx;
	border: 5rpx solid #3e6d86;
	width: 70%;
	color: #2d5062;
	margin: 0 auto;
	padding-left: 60rpx;
	border-radius: 60rpx;
}

.user-place {
	color: #2d5062;
}

.ltows .passinput {
	height: 100rpx;
	border: 5rpx solid #3e6d86;
	width: 70%;
	color: #3e6d86;
	padding-left: 60rpx;
	margin: 60rpx auto;
	border-radius: 60rpx;
}

.pass-place {
	color: #214068;
}

.lthress {
	height: 100rpx;
	border: 5rpx solid #587d34;
	width: 77%;
	color: #3e6d86;
	line-height: 100rpx;
	margin: 60rpx auto;
	border-radius: 60rpx;
	text-align: center;
}

.lfoutrs {
	height: 150rpx;
	display: flex;
	justify-content: space-around;
	line-height: 150rpx;
	color: black;
}
</style>